<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script type="text/javascript">
	var myList = [{"id":"17","name":"loc","price":123.0,"desc":"desc1rg","m_id":"2"},{"id":"21","name":"Olong1","price":12000.0,"desc":"asdasd","m_id":"10"},{"id":"18","name":"doctor thanh","price":20000.0,"desc":"123","m_id":"14"},{"id":"20","name":"olong tea plus","price":40000.0,"desc":"asd","m_id":"4"},{"id":"22","name":"LOC HOME","price":1111.0,"desc":"DESC","m_id":"26"},{"id":"19","name":"loc","price":123.0,"desc":"123","m_id":"14"},{"id":"1","name":"Pepsi 330ml","price":7000.0,"desc":" ","m_id":"1"},{"id":"2","name":"Pepsi 500ml","price":6000.0,"desc":" ","m_id":"2"},{"id":"6","name":"Coke","price":7000.0,"desc":" hello","m_id":"10"},{"id":"8","name":"Vfresh","price":9000.0,"desc":" ","m_id":"3"}];

// Builds the HTML Table out of myList.
function buildHtmlTable() {
    var columns = addAllColumnHeaders(myList);

    for (var i = 0 ; i < myList.length ; i++) {
        var row$ = $('<tr/>');
        for (var colIndex = 0 ; colIndex < columns.length ; colIndex++) {
            var cellValue = myList[i][columns[colIndex]];

            if (cellValue == null) { cellValue = ""; }

            row$.append($('<td/>').html(cellValue));
        }
        $("#excelDataTable").append(row$);
    }
}

// Adds a header row to the table and returns the set of columns.
// Need to do union of keys from all records as some records may not contain
// all records
function addAllColumnHeaders(myList)
{
    var columnSet = [];
    var headerTr$ = $('<tr/>');

    for (var i = 0 ; i < myList.length ; i++) {
        var rowHash = myList[i];
        for (var key in rowHash) {
            if ($.inArray(key, columnSet) == -1){
                columnSet.push(key);
                headerTr$.append($('<th/>').html(key));
            }
        }
    }
    $("#excelDataTable").append(headerTr$);

    return columnSet;
}
</script>
</head>
<body onLoad="buildHtmlTable()">
	<table id="excelDataTable" border="1">
	</table>
</body>
</html>